<!--
 * @Author: 赵成刚-运输单-评价货主
-->
<template>
  <u-modal
    v-model="evaluatetheownerShow"
    :width="'650'"
    class="modal1"
    contentBg="transparent"
    :show-title="false"
    :showConfirmButton="false">
    <view class="freightSettlement-modal-box">
      <image
        class="topimg"
        :src="`${imgUrl}waybill/pingjia.png`" />
      <view class="d-flex j-c title">评价货主</view>
      <view class="freightSettlement-center-box">
        <view class="d-flex j-c">
          <image
            class="portraitimg"
            src="../../../../static/my/avatar.png" />
        </view>
        <view class="d-flex j-c text-949699"
          >综合评分：{{ staticObj.shipperEvaluate }}</view
        >
        <view class="d-flex j-c text-949699 m-t-16"
          >{{ staticObj.corpName }} {{ staticObj.shipperName }}</view
        >
        <view class="d-flex j-c m-t-32">
          <view class="w-140"> 运费结算： </view>
          <u-rate
            :count="count"
            size="40"
            v-model="evaluate.efficiency"
            active-color="#FADB14"></u-rate
          ><view class="text-f16">{{ evaluate.efficiency }}星</view>
        </view>
        <view class="d-flex j-c m-t-25">
          <view class="w-140"> 卸货服务： </view>
          <u-rate
            :count="count"
            size="40"
            v-model="evaluate.safety"
            active-color="#FADB14"></u-rate
          ><view class="text-f16">{{ evaluate.safety }}星</view>
        </view>
        <view class="d-flex j-c m-t-25">
          <view class="w-140">服务质量： </view>
          <u-rate
            :count="count"
            size="40"
            v-model="evaluate.quality"
            active-color="#FADB14"></u-rate
          ><view class="text-f16">{{ evaluate.quality }}星</view>
        </view>
        <view class="d-flex j-c m-t-25">
          <view class="w-140">满意度： </view>
          <u-rate
            :count="count"
            size="40"
            v-model="evaluate.satisfy"
            active-color="#FADB14"></u-rate
          ><view class="text-f16">{{ evaluate.satisfy }}星</view>
        </view>
        <view class="d-flex j-c m-t-25">
          <view class="w-140">总体评价： </view>
          <u-rate
            :count="count"
            size="40"
            v-model="evaluate.total"
            active-color="#FADB14"></u-rate
          ><view class="text-f16">{{ evaluate.total }}星</view>
        </view>
      </view>
      <view class="freightSettlement-btn">
        <u-button
          class="u-btn"
          @click="evaluatetheownercancel"
          :throttle-time="0"
          >取 消
        </u-button>
        <u-button
          class="u-btn"
          type="primary"
          @click="evaluatetheownerconfirm"
          >确 定
        </u-button>
      </view>
    </view>
  </u-modal>
</template>
<script>
import { imgUrl } from 'common/httpEnum'

export default {
  name: 'evaluatetheownerModal',
  props: {
    evaluatetheownerShow: {
      type: Boolean,
      default: false
    },
    staticObj: {
      type: Object,
      default: () => {
        return {}
      }
    }
  },
  data() {
    return {
      imgUrl,
      value: '',
      count: 5, //评价星星个数
      evaluate: {
        efficiency: '', //运输效率
        safety: '', //运输安全
        quality: '', //服务质量
        satisfy: '', //满意度
        total: '' //总体评价
      }
    }
  },
  methods: {
    //评价货主弹窗-确认
    evaluatetheownerconfirm() {
      let rateList = Object.values(this.evaluate)
      if (!rateList[0]) return this.$api.msg('请评价运费结算')
      if (!rateList[1]) return this.$api.msg('请评价卸货服务')
      if (!rateList[2]) return this.$api.msg('请评价服务质量')
      if (!rateList[3]) return this.$api.msg('请评价满意度')
      if (!rateList[4]) return this.$api.msg('请评价总体评价')
      this.$emit('evaluatetheownerconfirm', this.evaluate)
    },
    //评价货主弹窗-取 消
    evaluatetheownercancel() {
      this.$emit('evaluatetheownercancel', false)
    }
  }
}
</script>
<style lang="scss" scoped>
@import './modal.scss';
</style>
